/* 第一种方法 flex*/


/* .all {
    display: flex;
}

.left {
    flex: 1;
}

.right {
    flex: 1;
} */


/* 第二种方法float  */


/* .all {
    display: flex;
    width: 100%;
}

.left {
    width: 200px;
    margin-right: 30px;
    background-color: #5cb85c;
}

.right {
    flex: 1;
    background-color: #66afe9;
} */


/* https://www.cnblogs.com/xuepei/p/9990553.html */

#box {
    display: flex;
}

.left {
    width: 100px;
    background-color: green;
}

.right {
    width: 100px;
    height: 500px;
    background-color: blue;
}

.center {
    flex: 1;
    background-color: red;
}